<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@include file="/WEB-INF/mytag.jspf"%>

<!DOCTYPE html>
<html>
<head>
<base href="<%=basePath%>">
<title>user</title>
<script type="text/javascript">
var layerPage;//弹出框关闭时用到
function showShopTree() {
	layerPage = layer.open({
		title : "选择门店",
		type : 2,
		content : 'management/shop/shopTree'
	});
}
function showTreeData(treeNode){
	$("#shopName").val(treeNode.name);
	$("#shopId").val(treeNode.id);
}	
function upImage(){
	$("#imgForm").ajaxSubmit({
		dataType : "json",
		success : function(data) {
			if (data.success == true) {
				var url = data.msg;
				$("#imgId").attr("src",url);
				$("#photo").val(url);
			} else {
				alert(data.msg);
			}
		}
	});
}
$(function() {
	$("#vipForm").validate({
		rules : {
			"vipNo" : {
				required : true,
				isSim : true,
				remote : { // 异步验证是否存在
					type : "POST",
					url : 'management/vip/isExist',
					data : {
						vipNo : function() {
							return $("#vipNo").val();
						},
						id : function() {
							return $("#vipId").val();
						}
					}
				}
			},
			"shopName" : {
				required : true
			},
			"phoneNo" : {
				isSim : true
			},
			"name" : {
				maxlength:10
			},
			"points" :{
				number:true ,
				digits:true
			},
			"balance" :{
				number:true ,
				isPriceOne:true
			},
			"idNo" :{
				isIdCardNo: true 
			}
		},
		messages : {
			"vipNo" : {
				required : "请输入账号",
				isSim : "请输入正确的手机号码",
				remote : "该账号已经存在"
			},
			"name" : {
				maxlength  :"名字不能超过10位"
			},
			"shopName" : {
				required : "请选择门店"
			},
			"phoneNo" : {
				isSim : "请输入正确的手机号码"
			},
			"points" :{
				number:"请输入合法的数字",
				digits:"请输入整数"
			},
			"balance" :{
				number:"请输入合法的数字",
				isPriceOne : "余额最多保留一位小数"
			},
			"idNo" :{
				isIdCardNo:"请输入正确的身份证号"
			}
		},
		errorPlacement: function(error, element){//错误信息显示位置
			if(element.attr("name")=="shopName"){
				error.css("left",$(element).width()+110);
				error.insertAfter(element);
			}else{
				error.insertAfter(element);
			}
		 }
	});
	$("#submitBtn").on("click",function(){
		$("#vipForm").submit();
	});
});
</script>
</head>

<body>
	<ol class="am-breadcrumb am-breadcrumb-slash am-padding" style="margin-bottom: 0px;">
		<li><a href="management/index">首页</a></li>
		<li><a href="management/vip/index">会员档案管理</a></li>
		<li class="am-active">修改</li>
	</ol>
	<div class="am-g">
		<div class="am-u-md-12">
				<div class="am-tabs am-margin">
					<ul class="am-tabs-nav am-nav am-nav-tabs">
						<li class="am-active"><a href="javascript:void(0)">会员基本信息</a></li>
					</ul>
					<div class="am-tabs-bd">
						<div class="am-tab-panel am-active">
							<div class="am-g">
						
								<div class="am-u-sm-12">
									<form id="imgForm"  class="am-form am-form-horizontal am-block" action="management/file" method="post" enctype="multipart/form-data">	
										<label class="am-u-sm-2 am-form-label">会员头像</label>
										<div class="am-u-md-4 am-u-end">
												<c:if test="${empty t.photo }">
												<img id="imgId" src="file/a.png" class="am-form-field am-input-sm">
												</c:if>
												<c:if test="${!empty t.photo }">
													<img id="imgId" src="${t.photo }" class="am-form-field am-input-sm">
												</c:if>
												<div class="am-form-group am-form-file">
												  <button type="button" class="am-btn am-btn-default am-btn-sm">
												    <i class="am-icon-cloud-upload"></i> 选择要上传的图片</button>
												  <input name="imageFile" id="imageFile" onchange="upImage();" type="file" multiple>
												</div>
										</div>
									</form>
								</div>
								
								
								<div class="am-u-sm-12">
									<form  id = "vipForm" method="post" class="am-form am-form-horizontal" action="management/vip/update">
										<input type="hidden" name="vipId" id="vipId" value="${t.vipId }" class="am-form-field am-input-sm"><!-- 会员id -->
										<input type="hidden" name="compId" id="compId" value="${t.compId }" class="am-form-field am-input-sm"><!-- 企业id -->
										<input type="hidden" name="photo" id="photo" value="${t.photo }" class="am-form-field am-input-sm">
										<input type="hidden" name="isStar" id="isStar" value="${t.isStar }" class="am-form-field am-input-sm">
										<input type="hidden" name="operId" id="operId" value="${t.operId }" class="am-form-field am-input-sm">
										<input type="hidden" name="nickname" id="nickname" value="${t.nickname }" class="am-form-field am-input-sm">
										<input type="hidden" name="category" id="category" value="${t.category }" class="am-form-field am-input-sm">
										
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">会员卡号</label>
											<div class="am-u-md-4 am-u-end">
												<input type="text" name="vipNo" id="vipNo" value="${t.vipNo}" maxlength="30" class="am-form-field am-input-sm">
											</div>
										</div>
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">所属门店</label>
											<div class="am-u-md-4 am-u-end">
												<input type="text" id="shopName" name="shopName" value="${t.shopName}" class="am-form-field am-input-sm" readonly onclick="showShopTree();">
												<input type="hidden" id="shopId" name="shopId" value="${t.shopId}" class="am-form-field am-input-sm">
											</div>
											<div class="am-hide-sm-only am-u-md-6">
												<a href="javascript:void(0);" onclick="showShopTree(); return false;">选择</a>
											</div>
										</div>
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">姓名</label>
											<div class="am-u-md-4 am-u-end">
												<input type="text" name="name" id="name" value="${t.name }" maxlength="30" class="am-form-field am-input-sm">
											</div>
										</div>
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">性别</label>
											<div class="am-u-md-4 am-u-end">
												<input type="radio" name="sex" <c:if test="${t.sex eq 'M'}"> checked="checked" </c:if> value="M"> 男
												<input type="radio" name="sex" <c:if test="${t.sex eq 'F'}"> checked="checked" </c:if> value="F"> 女
											</div>
										</div>
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">生日</label>
											<div class="am-u-md-4 am-u-end">
												<input type="text" name="birthday" id="birthday" value="<fmt:formatDate value='${t.birthday}' type="date" pattern="yyyy-MM-dd"/>" class="am-form-field am-input-sm" data-am-datepicker readonly>
											</div>
										</div>
										<!-- <div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">微信昵称</label>
											<div class="am-u-md-4 am-u-end">
												<input type="text" name="nickname" id="nickname" value="${t.nickname }"  class="am-form-field am-input-sm">
											</div>
										</div>
										
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">微信操作号</label>
											<div class="am-u-md-4 am-u-end">
												<input type="text" name="operId" id="operId" value="${t.operId }" class="am-form-field am-input-sm">
											</div>
										</div>
										 -->
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">积分</label>
											<div class="am-u-md-4 am-u-end">
												<input type="text"  name="points" id="points" value="${t.points }" maxlength="11" class="am-form-field am-input-sm">
											</div>
										</div>
										
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">余额</label>
											<div class="am-u-md-4 am-u-end">
												<input type="text" name="balance" id="balance" value="${t.balance }" class="am-form-field am-input-sm" readonly="readonly">
											</div>
										</div>
										
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">联系电话</label>
											<div class="am-u-md-4 am-u-end">
												<input type="text" name="phoneNo" id="phoneNo" value="${t.phoneNo }" maxlength="20" class="am-form-field am-input-sm">
											</div>
										</div>
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">身份证号</label>
											<div class="am-u-md-4 am-u-end">
												<input type="text" name="idNo" id="idNo" value="${t.idNo }" maxlength="25" class="am-form-field am-input-sm">
											</div>
										</div>
										
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">发质自然状况</label>
											<div class="am-u-md-4 am-u-end">
												<t:dictSelect tabName="vip" colName="HAIR_NATURE_STATE" field="hairNatureState" id="hairNatureState" defaultVal="${t.hairNatureState }"></t:dictSelect>
											</div>
										</div>
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">发质健康状况</label>
											<div class="am-u-md-4 am-u-end">
												<t:dictSelect tabName="vip" colName="HAIR_HEALTH_STATE" field="hairHealthState" id="hairHealthState" defaultVal="${t.hairHealthState }"></t:dictSelect>
											</div>
										</div>
										
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">头皮性质</label>
											<div class="am-u-md-4 am-u-end">
												<t:dictSelect tabName="vip" colName="SCALP_STATE" field="scalpState" id="scalpState" defaultVal="${t.scalpState }"></t:dictSelect>
											</div>
										</div>
										
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">头屑情况</label>
											<div class="am-u-md-4 am-u-end">
												<t:dictSelect tabName="vip" colName="SCURF_STATE" field="scurfState" id="scurfState" defaultVal="${t.scurfState }"></t:dictSelect>
											</div>
										</div>
										
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">头皮炎症状况</label>
											<div class="am-u-md-4 am-u-end">
												<t:dictSelect tabName="vip" colName="SCALP_INFLAMMATION_STATE" field="scalpInflammationState" id="scalpInflammationState" defaultVal="${t.scalpInflammationState }"></t:dictSelect>
											</div>
										</div>
										<div class="am-form-group">
											<label class="am-u-sm-2 am-form-label">建议下次购买商品时间</label>
											<div class="am-u-md-4 am-u-end">
												<input type="text" name="suggestMdseNexttime" id="suggestMdseNexttime" value="<fmt:formatDate value='${t.suggestMdseNexttime}' type="date" pattern="yyyy-MM-dd"/>" class="am-form-field am-input-sm" data-am-datepicker readonly>
											</div>
										</div>
									</form>
								</div>
							</div>
						</div>
					</div>
				</div>
				<div class="am-margin">
					<button class="am-btn am-btn-primary am-btn-xs" type="button" id="submitBtn">
						<span class="am-icon-check"></span> 保存
					</button>
					<a href="javascript:;" onClick="javascript:history.back(-1);" class="am-btn am-btn-primary am-btn-xs"><span class="am-icon-times"></span> 取消</a>
				</div>
			
		</div>
	</div>
</body>
</html>
